<script setup>

</script>

<template>
  <section>
    <div class="max-w-7xl mx-auto py-12 px-6">
      <!-- 标题和链接 -->
      <div class="flex justify-between items-center mb-6">
        <h1 class="text-[#272626] text-8 leading-8 tracking-normal font-bold">The Mold Factory</h1>
        <a
            href="/contact-us"
            class="text-red-650 text-4.5 leading-4.5 tracking-normal font-semibold flex items-center"
        >
          Contact Us <span class="ml-1">➔</span>
        </a>
      </div>

      <!-- 图片网格 -->
      <div class="grid grid-cols-2 lg:grid-cols-4 gap-6">
        <!-- 图片1 -->
        <img
            src="/src/images/about-us/mold-factory-1.webp"
            alt="Mold Factory 1"
            class="w-full h-48 object-cover rounded-sm shadow-md"
        />
        <!-- 图片2 -->
        <img
            src="/src/images/about-us/mold-factory-2.webp"
            alt="Mold Factory 2"
            class="w-full h-48 object-cover rounded-sm shadow-md"
        />
        <!-- 图片3 -->
        <img
            src="/src/images/about-us/mold-factory-3.webp"
            alt="Mold Factory 3"
            class="w-full h-48 object-cover rounded-sm shadow-md"
        />
        <!-- 图片4 -->
        <img
            src="/src/images/about-us/mold-factory-4.webp"
            alt="Mold Factory 4"
            class="w-full h-48 object-cover rounded-sm shadow-md"
        />
      </div>
    </div>
  </section>
</template>

<style scoped>

</style>